<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.w3.org/1999/xhtml">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>SUOYUEの博客管理</title>

  <link rel="shortcut icon" th:href="@{/images/favicon.ico}" />
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/semantic-ui/2.2.4/semantic.min.css">
  <link rel="stylesheet" href="../../static/css/me.css" th:href="@{/css/me.css}">
</head>
<body>

<!--导航栏-->
<nav class="ui inverted gird-header" >
  <div class="ui container">
    <div class="ui inverted secondary stackable menu">
      <h2 class="ui olive header item" style="font-family: STSong">SUOYUEの管理后台</h2>
      <a href="#" th:href="@{/admin/blogs}" class="m-item item m-mobile-hide"><i class="home icon"></i>文章管理</a>
      <a href="#" th:href="@{/admin/types}" class="m-item item m-mobile-hide"><i class="clone outline icon"></i>分类管理</a>
      <a href="#" th:href="@{/admin/friendlinks}" class="m-item item m-mobile-hide"><i class="pencil alternate icon"></i>友链管理</a>
      <div class="right m-item m-mobile-hide menu">
        <div class="ui dropdown  item">
          <div class="text">
            <img class="ui avatar image" src="../../static/images/me.jpg" th:src="${session.user.avatar}">
            <span th:text="${session.user.nickname}">suoyue_zhan</span>
          </div>
          <i class="dropdown icon"></i>
          <div class="menu">
            <a href="" th:href="@{/admin/logout}" class="item">注销</a>
          </div>
        </div>
      </div>
    </div>
  </div>
<!--  <a href="#" class="ui menu toggle black icon button m-right-top m-mobile-show">-->
<!--    <i class="sidebar icon"></i>-->
<!--  </a>-->
</nav>

<br>
<br>
<br>

  <!--中间内容-->
  <div  class="m-padded-tb">
    <div class="ui container">
      <div class="ui success large message">
        <p align="center">念念不忘，必有回响：亲爱的篮球</p>
      </div>
      <p align="center"><iframe frameborder="0" src="https://v.qq.com/txp/iframe/player.html?vid=a0539xnnk9y" allowFullScreen="true" width="920px" height="580px"></iframe></p>
    </div>
  </div>

  <!--底部栏-->
<footer class="ui inverted vertical segment m-padded-tb-massive m-opacity" th:replace="_fragments :: footer">
  <!--容器-->
</footer>

  <script src="https://cdn.jsdelivr.net/npm/jquery@3.2/dist/jquery.min.js"></script>
  <script src="https://cdn.jsdelivr.net/semantic-ui/2.2.4/semantic.min.js"></script>

  <script>

    $('.menu.toggle').click(function () {
      $('.m-item').toggleClass('m-mobile-hide');
    });

    $('.ui.dropdown').dropdown({
      on : 'hover'
    });

  </script>
</body>
</html>